<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>当当图书</title>
		<style type="text/css">
			body{ min-width: 1200px;}
			
			#head{
				width: 1200px;
				height: 300px;
				border: 1px solid red;
			}
			#head #head2 ul li{
				
				display: inline-block;
				list-style: none;
				line-height: 30px;
				text-indent: 1em;
			}
			#head #head2 ul{
				background-color: lightskyblue;
			
				height: 40px;
			}
			#head #head4 ul li{
				display: inline-block;
				list-style: none;
				line-height: 40px;
				text-indent: 10px;
				
			}
			#head #head4 ul{
				background-color: orangered;
				height: 40px;
				width: 1160px;
			}
			#head #head4,#head5{width: 900px; height: 100px;}
			#head a{text-decoration: none; color: white;}
			#head #head2 ul{
				float: right;
			}
			#head #head3{
				float: right;
			}
			#head .p1{
				position: relative;
				top: -60px;
			}
			#head #head3{
				position: relative;
				left: 80px;
				top: -2px;
			}
			#head5{
				width: 1200px;
				height: 30px;
			}
			#content{
				border: 1px solid green;
				height: 500px;
				width: 1200px;
			}
			#content .p2{
				position: relative;
				margin: 10px;
			}
			#content #c3{
				position: relative;
				top: -260px;
				left: 20px;
			}
			#content #c4{
				width: 400px;
				position: relative;
				top: -350px;
				left: 200px;
				margin: 50px;
			}
			#content #c6,#c7{
				width: 400px;
				margin: 10px;
			}
			#content #c5{
				position: relative;
			}
			#content #c6 ul{
				position: relative;
				left: 100px;
				top: -100px;
			}
			#content #c7 ul{
				position: relative;
				left: 100px;
				top: -100px;
			}
			#content #c7{
				position: relative;
				top: -100px;
			}
			
			#content #c5{
				position: relative;
				left: 650px;
				top: -620px;
			}
			#content a{
				text-decoration: none;
			}
			
			
		</style>
	</head>
	<body>
		<div id="head">
			<div id="head1">
				<a href="#"><img src="../img/logo.jpg" /></a>
			</div>
			<div class="p1">
			<div id="head2">
				<ul>
					<li><a href="#">尾品汇</a></li>
					<li><a href="#">当当优品</a></li>
					<li><a href="#">数字馆</a></li>
					<li><a href="#">都看阅器</a></li>
				</ul>
			</div>
			<div id="head3">
				<img src="../img/icon_count.png"/>
			</div>
			</div>
			<div id="head4">
				<ul>
					<li><a href="#">首页</a></li>
					<li><a href="#">图书</a></li>
					<li><a href="#">音像</a></li>
					<li><a href="#">童装</a></li>
					<li><a href="#">服装</a></li>
					<li><a href="#">鞋靴</a></li>
					<li><a href="#">运动</a></li>
					<li><a href="#">箱包</a></li>
					<li><a href="#">美妆</a></li>
					<li><a href="#">珠宝</a></li>
					<li><a href="#">家居</a></li>
					<li><a href="#">食品</a></li>
					<li><a href="#">酒</a></li>
					<li><a href="#">手机</a></li>
					<li><a href="#">数码</a></li>
					<li><a href="#">电脑 </a></li>
					<li><a href="#">家电</a></li>
				</ul>
			</div>
			<div id="head5">
				<a href="#"><img src="../img/banner.png" /></a>
			</div>
		</div>
		<div id="content">
			<div id="c1">
				<a href="#"><img src="../img/bg_bang.gif"/></a>
			</div>
			<div class="p2">
			<div id="c2" >
				<a href="#"><img src="../img/book-01.jpg"/></a>
			</div>
			<div id="c3">
				<a href="#"><img src="../img/bookNo1.gif"/></a>
			</div>
			</div>
			<div id="c4">
				<ul>
					<li><a href="#">偷影子的人 </a></li>
					<li>作 者：[法] 马克·李维（Marc Levy）著,段韵灵 译</li>
					<li>出版社：湖南文艺出版社</li>
					<li>当当价：￥ 17.90</li>
					<li>不知道姓氏的克蕾儿。这就是你在我生命里的角色，
						我童年时的小女孩，今日蜕变成了女人，一段青梅竹马的回忆，
						一个时间之神没有应允的愿望。 
						一个老是受班上同学欺负的瘦弱小男孩，因为拥有一种特殊能力而强大：
						他能“偷别人的影子”，因而能看见他</li>
				</ul>
			</div>
			<div id="c5">
				<div id="c6">
					<a href="#"><img src="../img/book-02.jpg"/></a>
					<ul>
						<li><a href="#">看见(央视知名记者、主持人柴静：十年个人成长的告白，中国社会变迁的备忘 作 者：柴静 著</a></li>
						<li>出版社：广西师范大学出版社</li>
						<li>￥ 29.40 7.4折</li>
					</ul>
				</div>
				<div id="c7">
					<a href="#"><img src="../img/book-03.jpg"/></a>
					
					<ul>
						<li><a href="#">改变孩子先改变自己</a></li>
						<li>作 者：贾容韬 贾毅 著</li>
						<li>出版社：作家出版社</li>
						<li>￥ 22.20 7.4折</li>
					</ul>
				</div>
			</div>
		</div>
	</body>
</html>
